import Bg_rw_wd from './bg_rw_wd'
import Bg_rw_sx from './bg_rw_sx'
import { Button, Tabs,Modal,DatePicker, Space,TreeSelect  } from 'antd';
import React, { useState,} from 'react';
import axios from 'axios';
import 'antd/dist/antd.css';
import '../view/css/bg_rw.css'
import { Select } from 'antd';
const { Option } = Select;
const { TabPane } = Tabs;


let Bg_rw = function(){
    const [visible, setVisible] = useState(false);
    const [data1,setData1] = useState([])
    const [val,setval] = useState('')
    var js
    var ks
    function callback(key) {
        console.log(key);
    }
    function valchange(event){
        let str = event.target.value
        console.log(str);
        setval(str)
    }
    function kssj(sj){
        ks=+new Date(sj);
        console.log(ks);
    }
    function jssj(sj){
        js=+new Date(sj);
        console.log(js);
    }
    function ccc(){
        setVisible(false)
        const FetchData = async () => {
            const result = await axios.post(
                'http://crm.cimns.com/index.php/oa/task/save',{
                    main_user_id: '',
                    start_time: ks,
                    stop_time: js,
                    description: 22233,
                    priority: 0,
                    name: val,
                    
                }
            );
            
        };
        FetchData();
        window.location.reload();
    }
    function ry(){
        const FetchData = async () => {
            const result = await axios.post(
                'http://crm.cimns.com/index.php/admin/users/getUserList'
            );
            
            setData1(result.data.data)
        };
        FetchData();
        
        
    }
    var state = {
        value: undefined,
    };
    function handleChange(value) {
        console.log(`selected ${value}`);
    }
    
    return(
        <div className="rw">
            <div> 
                <div className="new-wrap">
                    <Button type="primary" onClick={() =>{setVisible(true);ry()} }>新建任务</Button>
                </div>
                <Tabs defaultActiveKey="1" onChange={callback} addIcon={<Button>111111</Button>}>
                    <TabPane tab="我的任务" key="1">
                        <Bg_rw_wd/>
                    </TabPane>
                    <TabPane tab="我下属的任务" key="2">
                        <Bg_rw_sx/>
                    </TabPane>
                </Tabs>
                
            </div>
            <div>
      
                <Modal
                    centered
                    visible={visible}
                    onOk={() =>ccc()}
                    onCancel={() => setVisible(false)}
                    width={100+'%'}
                    height={100+'%'}
                >
                    <div className="cj">
                        <div>
                            <h2>创建日程</h2>
                            <div className='zt' style={{ width: '45%' ,float:'left'}}>
                                <p><span>*</span>主题</p>
                                <input placeholder='请输入内容'  value={val} onChange={valchange}/>
                            </div>
                            <div className='cy'>
                                <p><span>*</span>参与人</p>
                                <Select
                                    mode="multiple"
                                    style={{ width: '40%' ,float:'left',margin:0}}
                                    placeholder="+添加"
                                    
                                    onChange={handleChange}
                                    optionLabelProp="label"
                                >
                                    {data1.map((item,index)=>{
                                        return(
                                            <Option key={index} value={item.realname} label={item.realname}>
                                            
                                            </Option>
                                        )
                                        
                                    })}
                                </Select>
                            </div>
                            <div className='ksjs clearfix'>
                            <div className='ks' style={{ width: '45%' ,float:'',marginTop:20+'px'}}>
                                <p><span>*</span>开始时间</p>
                                <Space direction="vertical" size={12}>
                                    <DatePicker onChange={kssj} renderExtraFooter={() => 'extra footer'} showTime placeholder='请选择时间' />
                                </Space>
                            </div>
                            <div className='js' style={{ width: '45%' ,marginTop:-68+'px'}}>
                                <p><span>*</span>结束时间</p>
                                <Space direction="vertical" size={12}>
                                    <DatePicker onChange={jssj} renderExtraFooter={() => 'extra footer'} showTime placeholder='请选择时间' />
                                </Space>
                        </div>
                        </div>
                            <div className='bz'>
                                <p><span>*</span>备注</p>
                                <textarea></textarea>
                            </div>
                        </div>
                    </div>
                </Modal>
            </div>
        </div>
    )
}
export default Bg_rw